<template>
  <div class="dashboard-container">
    <el-loading
      v-show="loading"
      class="loading-mask"
      spinner="el-icon-loading"
      background="rgba(255, 255, 255, 0.8)"
    ></el-loading>
    <!-- 搜索筛选区域 -->
    <div v-if="basicvisibale">
      <!-- <el-form :model="searchForm" class="formsearch" label-width='120px'>
        <el-row :gutter="20" >
    <el-col :span="5">    <el-form-item label="        评审会名称">
        <el-input v-model="searchForm.expertName" placeholder="请输入"/>
      </el-form-item></el-col>
    <el-col :span="5">     <el-form-item label="项目名称">
        <el-input v-model="searchForm.expertName" placeholder="请输入"/>
      </el-form-item></el-col>
    <el-col :span="5">      <el-form-item label="项目阶段">
        <el-input v-model="searchForm.expertName" placeholder="请输入"/>
      </el-form-item></el-col>
      <el-col :span="5">      <el-form-item label="操作处室">
        <el-input v-model="searchForm.expertName" placeholder="请输入"/>
      </el-form-item></el-col>

                    
                    </el-row>
                    <el-row :gutter="20" >
    <el-col :span="5">    <el-form-item label="是否完成专家抽选">
        <el-input v-model="searchForm.expertName" placeholder="请输入"/>
      </el-form-item></el-col>
    <el-col :span="5">     <el-form-item label="项目名称">
        <el-input v-model="searchForm.expertName" placeholder="请输入"/>
      </el-form-item></el-col>
    <el-col :span="5">      <el-form-item label="项目阶段">
        <el-input v-model="searchForm.expertName" placeholder="请输入"/>
      </el-form-item></el-col>
      <el-col :span="5">      <el-form-item label="操作处室">
        <el-input v-model="searchForm.expertName" placeholder="请输入"/>
      </el-form-item></el-col>

                    
                    </el-row> -->

      <!-- <el-form-item label="职称">
        <el-select v-model="searchForm.title" placeholder="请选择">
          <el-option
            v-for="item in titleOptions"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          />
        </el-select>
      </el-form-item>
      <el-form-item label="专业">
        <el-cascader
          v-model="searchForm.major"
          :options="majorOptions"
          placeholder="请选择"
          @change="handleMajorChange"
        />
      </el-form-item>
      <el-form-item label="性别">
        <el-select v-model="searchForm.gender" placeholder="请选择">
          <el-option label="男" value="male" />
          <el-option label="女" value="female" />
        </el-select>
      </el-form-item>
      <el-form-item label="年龄">
        <span class="age-label">
          <el-input v-model="searchForm.ageStart" placeholder="起始" />
          <span class="mx-2">-</span>
          <el-input v-model="searchForm.ageEnd" placeholder="结束" />
          <span class="mx-2">周岁</span>
        </span>
      </el-form-item>
      <el-form-item label="审核状态">
        <el-select v-model="searchForm.auditStatus" placeholder="请选择">
          <el-option
            v-for="item in auditStatusOptions"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          />
        </el-select>
      </el-form-item>
      <el-form-item label="审核处室">
        <el-select v-model="searchForm.auditOffice" placeholder="请选择">
          <el-option
            v-for="item in officeOptions"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          />
        </el-select>
      </el-form-item>
      <el-form-item class="form-actions">
        <el-button class="primary-btn" @click="resetForm">清空</el-button>
        <el-button class="primary-btn" @click="search">搜索</el-button>
      </el-form-item>-->
      <!-- </el-form>  -->
      <el-row :gutter="20" style="margin-bottom: 1.5%">
        <el-col :span="6"
          ><div class="grid-content">
            评审会名称：<el-input
              style="width: 50%"
              placeholder="请输入内容"
              v-model="searchForm.reviewMeetingName"
              clearable
              class="input"
            ></el-input></div
        ></el-col>
        <el-col :span="5"
          ><div class="grid-content">
            项目名称：<el-input
              style="width: 65%"
              placeholder="请输入内容"
              v-model="searchForm.projectName"
              clearable
              class="input"
            ></el-input></div
        ></el-col>
        <el-col :span="5"
          ><div class="grid-content">
            项目阶段：<el-input
              style="width: 65%"
              placeholder="请输入内容"
              v-model="searchForm.projectPhase"
              clearable
              class="input"
            ></el-input></div
        ></el-col>
        <el-col :span="5"
          ><div class="grid-content">
            操作处室：<el-input
              style="width: 65%"
              placeholder="请输入内容"
              v-model="searchForm.reviewOrganization"
              clearable
              class="input"
            ></el-input></div
        ></el-col>
      </el-row>
      <el-row :gutter="20" style="margin-bottom: 1.5%">
        <el-col :span="6"
          ><div class="grid-content">
            是否完成专家抽选：
            <el-select
              style="width: 40%"
              v-model="searchForm.isLottery"
              placeholder="请选择"
            >
              <el-option
                v-for="item in options"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              >
              </el-option>
            </el-select></div
        ></el-col>
        <el-col :span="5"
          ><div class="grid-content">
            专家个数：<el-input
              style="width: 65%"
              placeholder="请输入内容"
              v-model.number="searchForm.selectedExpertsCount"
              clearable
              class="input"
            ></el-input></div
        ></el-col>
        <el-col :span="5"
          ><div class="grid-content">
            项目变更次数：<el-input
              style="width: 25%"
              placeholder="次数"
              v-model.number="searchForm.minChangeCount"
              clearable
              class="input"
            ></el-input
            ><span style="margin-left: 3%; margin-right: 3%">-</span
            ><el-input
              placeholder="次数"
              style="width: 25%"
              v-model.number="searchForm.maxChangeCount"
              clearable
              class="input"
            ></el-input></div
        ></el-col>
        <el-col :span="5"
          ><div class="grid-content">
            评审结论：<el-select
              style="width: 65%"
              v-model="searchForm.reviewConclusion"
              placeholder="请选择"
            >
              <el-option
                v-for="item in options1"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              >
              </el-option>
            </el-select></div
        ></el-col>
        <el-col :span="3"
          ><div class="grid-content">
            <el-button class="primary-btn" @click="cleartable">清空</el-button>
            <el-button class="primary-btn" @click="fetchData(1)"
              >搜索</el-button
            >
          </div></el-col
        >
      </el-row>
      <!-- 操作按钮区域 -->
      <div v-if="role != 'lEADER'" class="mb-4 button-container">
        <el-button class="custom-success-btn" @click="addExpert"
          >新增</el-button
        >
        <el-button class="custom-danger-btn" @click="deleteSelected"
          >删除</el-button
        >
        <!-- <el-button class="custom-primary-btn" @click="exportData">导出</el-button>
      <el-button class="custom-info-btn" @click="audit">审核</el-button>
      <el-button class="custom-warning-btn" @click="storage">入库</el-button> -->
      </div>
      <!-- 数据表格区域 -->
      <el-table
        :data="list"
        stripe
        border
        fit
        highlight-current-row
        ref="expertTable"
        @selection-change="handleSelectionChange"
      >
        <el-table-column type="selection" width="55" />
        <!-- <el-table-column type="index" align="center"  label="序号" width='50'/>
       -->
        <el-table-column align="center" label="序号" width="50">
          <template slot-scope="scope">
            {{ (currentPage - 1) * pageSize + scope.$index + 1 }}
          </template>
        </el-table-column>
        <el-table-column
          prop="reviewMeetingName"
          align="center"
          label="评审会名称"
        />
        <el-table-column prop="projectName" align="center" label="项目名称">
          <!-- <template slot-scope="scope">
          <el-tag :type="getStatusType(scope.row.auditStatus)">{{ scope.row.auditStatus }}</el-tag>
        </template> -->
        </el-table-column>
        <el-table-column prop="projectPhase" align="center" label="项目阶段" />
        <el-table-column prop="reviewDate" align="center" label="评审会时间">
          <!-- <template slot-scope="scope">
          {{ scope.row.gender === 'male' ? '男' : '女' }}
        </template> -->
        </el-table-column>
        <el-table-column prop="dept" align="center" label="操作处室" />
        <el-table-column
          prop="isLottery"
          align="center"
          label="是否完成专家抽选"
          width="150"
        >
          <template slot-scope="scope">
            {{ scope.row.isLottery ? "是" : "否" }}
          </template>
        </el-table-column>
        <el-table-column
          prop="selectedExpertsCount"
          align="center"
          label="专家个数"
        >
          <!-- <template slot-scope="scope">
          {{ formatMajor(scope.row.expertiseList) }}
          {{formatMajor(scope.row.experts)}}
        </template>-->
        </el-table-column>
        <el-table-column prop="experts" align="center" label="专家姓名">
          <!-- <template slot-scope="scope">
          {{ getEducationLabel(scope.row.education) }}
        </template> -->
        </el-table-column>
        <el-table-column
          prop="reviewConclusion"
          align="center"
          label="评审结论"
        />
        <el-table-column
          prop="changeCount"
          align="center"
          label="项目变更次数"
        />
        <!-- <el-table-column prop="entryTime" align="center"  label="入库时间" />
      <el-table-column prop="projectChangeCount" align="center"  label="参与项目出现变更次数" /> -->
        <el-table-column
          v-if="role != 'lEADER'"
          label="操作"
          align="center"
          width="180"
        >
          <template slot-scope="scope">
            <el-button type="text" size="small" @click="viewExpert(scope.row)"
              >查看</el-button
            >
            <el-button type="text" size="small" @click="editExpert(scope.row)"
              >编辑</el-button
            >
          </template>
        </el-table-column>
      </el-table>
      <!-- <div v-if="expertList.length === 0" class="empty-tip">
      <el-icon><circle-notch /></el-icon>
      <span>暂无符合条件的专家数据</span>
    </div> -->
      <!-- 分页组件 -->
      <!-- <el-pagination
      :current-page="currentPage"
      :page-sizes="[10, 20, 30, 50]"
      :page-size="pageSize"
      :total="total"
      @size-change="handleSizeChange"
      @current-change="handleCurrentChange"
    /> -->
      <el-pagination
        :current-page="currentPage"
        :total="total"
        :page-size="pageSize"
        style="padding: 30px 0; text-align: center"
        layout="total, prev, pager, next, jumper"
        @current-change="changepage"
      />
    </div>
    <div v-if="addvisibale">
      <el-page-header
        title="返回"
        @back="back1"
        content="新增"
        style="line-height: 50px; border-radius: 5px; background-color: #ffffff"
      >
      </el-page-header>
      <addblock :row="row"></addblock>
    </div>
    <div v-if="editvisibale">
      <el-page-header
        title="返回"
        @back="back2"
        content="编辑"
        style="line-height: 50px; border-radius: 5px; background-color: #ffffff"
      >
      </el-page-header>
      <editblock :row="row"></editblock>
    </div>
    <div v-if="showvisibale">
      <el-page-header
        title="返回"
        @back="back3"
        content="查看"
        style="line-height: 50px; border-radius: 5px; background-color: #ffffff"
      >
      </el-page-header>
      <showblock :row="row"></showblock>
    </div>
  </div>
</template>

<script>
import axios from "axios";
import addblock from "./add.vue";
import editblock from "./edit.vue";
import showblock from "./show.vue";
import { searchmeeting, deletemeeting } from "@/api/table";
export default {
  name: "ExpertDashboard",
  components: {
    addblock,
    editblock,
    showblock,
  },
  data() {
    return {
      list: [],
      addvisibale: false,
      editvisibale: false,
      role: "",
      showvisibale: false,
      basicvisibale: true,
      searchForm: {
        reviewMeetingName: "",
        projectName: "",
        projectPhase: "",
        reviewOrganization: "",
        isLottery: "",
        selectedExpertsCount: null,
        minChangeCount: "",
        maxChangeCount: "",
        reviewConclusion: "",
        pageNum: 1,
        pageSize: 8,
      },
      options: [
        { value: "true", label: "是" },
        { value: "false", label: "否" },
      ],
      options1: [
        { value: "评审通过", label: "评审通过" },
        { value: "进一步修改完善", label: "进一步修改完善" },
        { value: "不予通过", label: "不予通过" },
      ],
      titleOptions: [
        { value: "副高级职称", label: "副高级职称" },
        { value: "正高级职称", label: "正高级职称" },
        { value: "同等执业资格", label: "同等执业资格" },
        { value: "其他", label: "其他" },
      ],
      majorOptions: [
        // {
        //   value: "督查稽察",
        //   label: "督查稽察",
        //   children: [
        //     { value: "建设管理", label: "建设管理" },
        //     { value: "计划管理", label: "计划管理" },
        //     { value: "质量管理", label: "质量管理" },
        //     { value: "安全管理", label: "安全管理" }
        //   ]
        // },
        { value: "水利规划", label: "水利规划" },
        { value: "水文泥沙", label: "水文泥沙" },
        { value: "水资源", label: "水资源" },
        { value: "节水评价", label: "节水评价" },
        { value: "水土保持", label: "水土保持" },
        { value: "农田水利", label: "农田水利" },
        { value: "城乡供水", label: "城乡供水" },
        { value: "水工结构", label: "水工结构" },
        { value: "河道治理", label: "河道治理" },
        { value: "工程地质与工程测绘", label: "工程地质与工程测绘" },
        { value: "水旱灾害防御抢险", label: "水旱灾害防御抢险" },
        { value: "工程造价与经济评价", label: "工程造价与经济评价" },
        { value: "征地移民", label: "征地移民" },
        { value: "电气机电与金属结构", label: "电气机电与金属结构" },
        { value: "水利政策法规", label: "水利政策法规" },
        { value: "施工组织与管理", label: "施工组织与管理" },
        { value: "水利信息化", label: "水利信息化" },
        { value: "工程管理", label: "工程管理" },
        { value: "节能评价", label: "节能评价" },
        { value: "资金管理", label: "资金管理" },
        { value: "水力发电", label: "水力发电" },
        { value: "劳动安全与工业卫生", label: "劳动安全与工业卫生" },
        { value: "环境影响评价", label: "环境影响评价" },
        { value: "社会稳定分析", label: "社会稳定分析" },
        { value: "质量检测", label: "质量检测" },
        { value: "水文化", label: "水文化" },
        {
          value: "劳动安全与工业卫生(安全生产)",
          label: "劳动安全与工业卫生(安全生产)",
        },
        {
          value: "质量管理",
          label: "质量管理",
        },
        {
          value: "建设管理",
          label: "建设管理",
        },
        {
          value: "计划管理",
          label: "计划管理",
        },
      ],
      auditStatusOptions: [
        { value: "未审核", label: "未审核" },
        { value: "已审核入库", label: "已审核入库" },
        { value: "审核不通过", label: "审核不通过" },
      ],
      officeOptions: [
        { value: "建监处", label: "建监处" },
        { value: "水保处", label: "水保处" },
        { value: "农水处", label: "农水处" },
        { value: "水资源处", label: "水资源处" },
        { value: "移民处", label: "移民处" },
        { value: "河湖处", label: "河湖处" },
        { value: "节水办", label: "节水办" },
        { value: "规计处", label: "规计处" },
        { value: "财审处", label: "财审处" },
        { value: "防御处", label: "防御处" },
      ],
      // 新增学历选项
      educationOptions: [
        {
          value: "博士研究生",
          label: "博士研究生",
        },
        {
          value: "硕士研究生",
          label: "硕士研究生",
        },
        {
          value: "大学本科",
          label: "大学本科",
        },
        {
          value: "大学专科",
          label: "大学专科",
        },
        {
          value: "高中/中专",
          label: "高中/中专",
        },
        {
          value: "初中及以下",
          label: "初中及以下",
        },
      ],
      expertList: [],
      currentPage: 1,
      pageSize: 8,
      total: 0,
      loading: false,
      layout: "total, sizes, prev, pager, next, jumper",
      // 编辑相关数据
      editDialogVisible: false,
      editForm: {},
      editFormOriginal: {}, // 用于保存原始数据，支持取消
      editRules: {
        expertName: [
          { required: true, message: "请输入专家姓名", trigger: "blur" },
        ],
        gender: [{ required: true, message: "请选择性别", trigger: "change" }],
        age: [
          { required: true, message: "请输入年龄", trigger: "blur" },
          { type: "number", message: "年龄必须为数字值", trigger: "blur" },
        ],
        position: [{ required: true, message: "请输入职位", trigger: "blur" }],
        title: [{ required: true, message: "请选择职称", trigger: "change" }],
        major: [{ required: true, message: "请选择专业", trigger: "change" }],
        education: [
          { required: true, message: "请选择学历", trigger: "change" },
        ],
        unit: [{ required: true, message: "请输入单位", trigger: "blur" }],
        auditStatus: [
          { required: true, message: "请选择审核状态", trigger: "change" },
        ],
        auditOffice: [
          { required: true, message: "请选择审核处室", trigger: "change" },
        ],
      },
      // 新增相关数据
      addDialogVisible: false,
      addForm: {
        expertName: "",
        gender: "male",
        age: null,
        position: "",
        title: "",
        major: [],
        education: "",
        unit: "",
        auditStatus: "",
        auditOffice: "",
      },
      addRules: {
        expertName: [
          { required: true, message: "请输入专家姓名", trigger: "blur" },
        ],
        gender: [{ required: true, message: "请选择性别", trigger: "change" }],
        age: [
          { required: true, message: "请输入年龄", trigger: "blur" },
          { type: "number", message: "年龄必须为数字值", trigger: "blur" },
        ],
        position: [{ required: true, message: "请输入职位", trigger: "blur" }],
        title: [{ required: true, message: "请选择职称", trigger: "change" }],
        major: [{ required: true, message: "请选择专业", trigger: "change" }],
        education: [
          { required: true, message: "请选择学历", trigger: "change" },
        ],
        unit: [{ required: true, message: "请输入单位", trigger: "blur" }],
        auditStatus: [
          { required: true, message: "请选择审核状态", trigger: "change" },
        ],
        auditOffice: [
          { required: true, message: "请选择审核处室", trigger: "change" },
        ],
      },
      // 导出相关数据
      exportDialogVisible: false,
      exportForm: {
        format: "excel",
        scope: "current",
      },
      // 删除相关数据
      deleteDialogVisible: false,
      deleteForm: {
        selectedIds: [],
      },
      selectedRows: [],
      // API配置
      apiConfig: {
        baseUrl: process.env.VUE_APP_BASE_API || "",
        useMock: true, // 切换真实API时设为false
      },
      storageDialogVisible: false,
      isStoraging: false,
      storageProgress: 0,
      storageComplete: false,
      storageStatus: "",
      successCount: 0,
      failCount: 0,
      failList: [],
      auditDialogVisible: false,
      batchAuditStatus: "已审核入库",
      rejectReason: "",
      showRejectReason: false,
      row: {},
    };
  },
  computed: {
    getStorageStatusType() {
      switch (this.storageStatus) {
        case "准备入库":
          return "info";
        case "入库中":
          return "warning";
        case "入库完成":
          return "success";
        case "入库异常":
          return "danger";
        default:
          return "info";
      }
    },
    canConfirmAudit() {
      // 如果有任何专家被设置为不通过，且没有填写原因，则不能确认
      if (this.showRejectReason && !this.rejectReason.trim()) {
        return false;
      }
      // 检查是否所有专家都已选择审核结果
      return this.selectedRows.every((row) => row.newAuditStatus);
    },
  },
  watch: {
    batchAuditStatus(newValue) {
      // 批量设置审核状态
      this.selectedRows.forEach((row) => {
        row.newAuditStatus = newValue;
      });
      this.showRejectReason = newValue === "审核不通过";
    },
  },
  created() {
    // this.fetchData();
    this.role = sessionStorage.getItem("role");
    console.log(this.role);
    searchmeeting(this.searchForm).then((res) => {
      console.log(res);
      this.list = res.records;
      this.total = res.total;
    });
  },
  methods: {
    back1() {
      this.basicvisibale = true;

      this.addvisibale = false;
      this.fetchData(this.currentPage);
    },
    back2() {
      this.basicvisibale = true;

      this.editvisibale = false;
      this.fetchData(this.currentPage);
    },
    back3() {
      this.basicvisibale = true;

      this.showvisibale = false;
      this.fetchData(this.currentPage);
    },
    // 获取专家列表
    fetchData(pagenum = 1) {
      this.searchForm.pageNum = pagenum;
      searchmeeting(this.searchForm).then((res) => {
        console.log(res);
        this.list = res.records;
        this.total = res.total;
        // this.currentPage = res.pages
        // if (res.code == 200) {
        //   this.list = res.records
        //   this.total = res.total
        // }
      });
    },
    getIndex(index) {
      // 公式：(当前页码 - 1) * 每页条数 + 数据在当前页的索引 + 1
      return (this.currentPage - 1) * this.pageSize + index + 1;
    },
    // 模拟API请求函数
    simulateApiRequest(params) {
      return new Promise((resolve, reject) => {
        // 模拟网络延迟
        setTimeout(() => {
          try {
            // 复制模拟数据
            let allData = [
              {
                id: 1,
                expertName: "张三",
                auditStatus: "已审核入库",
                auditOffice: "建监处",
                gender: "male",
                age: 45,
                position: "主任",
                major: ["督查稽察", "建设管理"],
                education: "博士研究生",
                title: "正高级职称",
                unit: "西安科技大学",
                entryTime: "2025-05-10",
              },
              {
                id: 2,
                expertName: "李四",
                auditStatus: "审核不通过",
                auditOffice: "水保处",
                gender: "female",
                age: 32,
                position: "工程师",
                major: ["水资源"],
                education: "硕士研究生",
                title: "副高级职称",
                unit: "西安理工大学",
                entryTime: "2025-05-01",
              },
              {
                id: 3,
                expertName: "王五",
                auditStatus: "未审核",
                auditOffice: "规计处",
                gender: "male",
                age: 50,
                position: "高级工程师",
                major: ["水利规划"],
                education: "大学本科",
                title: "同等执业资格",
                unit: "陕西省水利学校",
                entryTime: "2025-05-15",
              },
              {
                id: 4,
                expertName: "赵六",
                auditStatus: "已审核入库",
                auditOffice: "水资源处",
                gender: "male",
                age: 38,
                position: "副主任",
                major: ["水资源"],
                education: "博士研究生",
                title: "正高级职称",
                unit: "水利部水资源研究所",
                entryTime: "2025-05-20",
              },
              {
                id: 5,
                expertName: "钱七",
                auditStatus: "未审核",
                auditOffice: "农水处",
                gender: "female",
                age: 42,
                position: "处长",
                major: ["农田水利"],
                education: "硕士研究生",
                title: "副高级职称",
                unit: "中国农业大学",
                entryTime: "2025-05-05",
              },
            ];
            // 应用筛选条件
            if (params.expertName) {
              const keyword = params.expertName.trim().toLowerCase();
              allData = allData.filter((item) =>
                item.expertName.toLowerCase().includes(keyword)
              );
            }

            if (params.title) {
              allData = allData.filter((item) => item.title === params.title);
            }

            if (params.major && params.major.length > 0) {
              allData = allData.filter((item) => {
                return params.major.every((m) => item.major.includes(m));
              });
            }

            if (params.gender) {
              allData = allData.filter((item) => item.gender === params.gender);
            }

            if (params.ageStart || params.ageEnd) {
              const ageStart = Number(params.ageStart) || 0;
              const ageEnd = Number(params.ageEnd) || Infinity;
              allData = allData.filter(
                (item) => item.age >= ageStart && item.age <= ageEnd
              );
            }

            if (params.auditStatus) {
              allData = allData.filter(
                (item) => item.auditStatus === params.auditStatus
              );
            }

            if (params.auditOffice) {
              allData = allData.filter(
                (item) => item.auditOffice === params.auditOffice
              );
            }

            // 分页处理
            const start = (params.page - 1) * params.pageSize;
            const end = start + params.pageSize;
            const paginatedData = allData.slice(start, end);

            // 模拟API响应
            resolve({
              code: 200,
              message: "success",
              data: paginatedData,
              total: allData.length,
            });
          } catch (error) {
            reject(error);
          }
        }, 800); // 模拟800ms的网络延迟
      });
    },

    // 搜索方法（触发筛选）
    search() {
      this.currentPage = 1; // 重置为第一页
      // 提取搜索参数（过滤空值）
      const searchParams = {
        expertName: this.searchForm.expertName,
        title: this.searchForm.title || null,
        major: this.searchForm.major.length > 0 ? this.searchForm.major : null,
        gender: this.searchForm.gender || null,
        ageStart: this.searchForm.ageStart || null,
        ageEnd: this.searchForm.ageEnd || null,
        auditStatus: this.searchForm.auditStatus || null,
        auditOffice: this.searchForm.auditOffice || null,
      };
      this.fetchData(searchParams); // 传入筛选参数
    },

    // 清空方法（重置表单并刷新数据）
    cleartable() {
      this.$confirm("确定要清空所有筛选条件吗？", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      }).then(() => {
        // 重置表单数据
        (this.searchForm = {
          reviewMeetingName: "",
          projectName: "",
          projectPhase: "",
          reviewOrganization: "",
          isLottery: "",
          selectedExpertsCount: null,
          minChangeCount: "",
          maxChangeCount: "",
          reviewConclusion: "",
          pageNum: 1,
          pageSize: 8,
        }),
          // cleartable
          // 触发搜索（无筛选条件，显示全部数据）
          this.fetchData(1);
        // this.$message.success('筛选条件已清空');
      });
    },

    // 获取状态标签类型
    getStatusType(status) {
      switch (status) {
        case "未审核":
          return "info";
        case "已审核入库":
          return "success";
        case "审核不通过":
          return "danger";
        default:
          return "info";
      }
    },

    // 分页相关方法
    handleSizeChange(size) {
      this.pageSize = size;
      this.fetchData();
    },

    handleCurrentChange(page) {
      this.currentPage = page;
      this.fetchData();
    },

    // 操作方法
    addExpert() {
      // 重置新增表单数据
      // this.addForm = {
      //   expertName: '',
      //   gender: '',
      //   age: null,
      //   position: '',
      //   title: '',
      //   major: [],
      //   education: '',
      //   unit: '',
      //   auditStatus: '',
      //   auditOffice: ''
      // };
      this.basicvisibale = false;

      this.addvisibale = true;
    },

    // 删除选中专家
    deleteSelected() {
      this.selectedRows = this.$refs.expertTable.selection;

      if (this.selectedRows.length === 0) {
        this.$message.warning("请先选择要删除的专家");
        return;
      }

      // 提取选中的专家ID
      const selectedIds = this.selectedRows.map((row) => row.id);
      console.log(selectedIds);
      deletemeeting(selectedIds).then((res) => {
        console.log(res);
        if (res.code == 200) {
          this.$message.success("删除成功！");
          this.fetchData(1);
        }
      });
      // 显示删除确认对话框
      // this.deleteDialogVisible = true;
    },

    // 确认删除
    confirmDelete() {
      this.loading = true;

      if (this.apiConfig.useMock) {
        // 模拟API调用
        setTimeout(() => {
          try {
            // 模拟删除操作
            this.expertList = this.expertList.filter(
              (item) => !this.deleteForm.selectedIds.includes(item.id)
            );

            // 刷新数据
            this.currentPage = 1; // 重置为第一页
            this.fetchData();

            // 关闭对话框
            this.deleteDialogVisible = false;

            // 显示成功消息
            this.$message({
              type: "success",
              message: `成功删除 ${this.selectedRows.length} 位专家及其关联账号`,
            });
          } catch (error) {
            console.error("删除失败:", error);
            this.$message({
              type: "error",
              message: "删除失败，请重试",
            });
          } finally {
            this.loading = false;
            // 重置删除表单
            this.deleteForm = {
              selectedIds: [],
            };
          }
        }, 800);
      } else {
        // 真实API调用
        axios
          .post(`${this.apiConfig.baseUrl}/api/expert/delete`, {
            ids: this.deleteForm.selectedIds,
          })
          .then(() => {
            // 刷新数据
            this.currentPage = 1;
            this.fetchData();

            // 关闭对话框
            this.deleteDialogVisible = false;

            // 显示成功消息
            this.$message({
              type: "success",
              message: `成功删除 ${this.selectedRows.length} 位专家及其关联账号`,
            });
          })
          .catch((error) => {
            console.error("删除失败:", error);
            this.$message({
              type: "error",
              message: "删除失败，请重试",
            });
          })
          .finally(() => {
            this.loading = false;
            // 重置删除表单
            this.deleteForm = {
              selectedIds: [],
            };
          });
      }
    },

    // 导出数据功能
    exportData() {
      // 检查是否有选中的行
      this.selectedRows = this.$refs.expertTable.selection;

      // 如果没有选中的行，默认使用当前页
      if (this.selectedRows.length === 0) {
        this.exportForm.scope = "current";
      } else {
        // 有选中的行，默认使用选中的行
        this.exportForm.scope = "selected";
      }

      this.exportDialogVisible = true;
    },

    // 确认导出
    async confirmExport() {
      this.loading = true;

      try {
        if (this.apiConfig.useMock) {
          // 模拟导出数据
          await new Promise((resolve) => setTimeout(resolve, 800));

          // 获取要导出的数据
          let exportData = [];
          if (this.exportForm.scope === "current") {
            // 导出当前页数据
            exportData = [...this.expertList];
          } else if (this.exportForm.scope === "all") {
            // 导出全部数据
            // 这里使用模拟数据，实际项目中应该从服务器获取全部数据
            exportData = [
              {
                id: 1,
                expertName: "张三",
                auditStatus: "已审核入库",
                auditOffice: "建监处",
                gender: "男",
                age: 45,
                position: "主任",
                major: "督查稽察 > 建设管理",
                education: "博士研究生",
                title: "正高级职称",
                unit: "西安科技大学",
                entryTime: "2025-04-10",
              },
              {
                id: 2,
                expertName: "李四",
                auditStatus: "审核不通过",
                auditOffice: "水保处",
                gender: "女",
                age: 32,
                position: "工程师",
                major: "水资源",
                education: "硕士研究生",
                title: "副高级职称",
                unit: "西安理工大学",
                entryTime: "2025-04-01",
              },
              {
                id: 3,
                expertName: "王五",
                auditStatus: "未审核",
                auditOffice: "规计处",
                gender: "男",
                age: 50,
                position: "高级工程师",
                major: "水利规划",
                education: "大学本科",
                title: "同等执业资格",
                unit: "陕西省水利学校",
                entryTime: "2025-04-15",
              },
              {
                id: 4,
                expertName: "赵六",
                auditStatus: "已审核入库",
                auditOffice: "水资源处",
                gender: "男",
                age: 38,
                position: "副主任",
                major: "水资源",
                education: "博士研究生",
                title: "正高级职称",
                unit: "水利部水资源研究所",
                entryTime: "2025-04-20",
              },
              {
                id: 5,
                expertName: "钱七",
                auditStatus: "未审核",
                auditOffice: "农水处",
                gender: "女",
                age: 42,
                position: "处长",
                major: "农田水利",
                education: "硕士研究生",
                title: "副高级职称",
                unit: "中国农业大学",
                entryTime: "2025-04-05",
              },
              {
                id: 6,
                expertName: "孙八",
                auditStatus: "已审核入库",
                auditOffice: "河湖处",
                gender: "男",
                age: 47,
                position: "高级工程师",
                major: "河道治理",
                education: "博士研究生",
                title: "正高级职称",
                unit: "长江水利委员会",
                entryTime: "2025-04-12",
              },
              {
                id: 7,
                expertName: "周九",
                auditStatus: "审核不通过",
                auditOffice: "防御处",
                gender: "女",
                age: 36,
                position: "工程师",
                major: "水旱灾害防御抢险",
                education: "硕士研究生",
                title: "副高级职称",
                unit: "黄河水利委员会",
                entryTime: "2025-04-18",
              },
            ];
          } else if (this.exportForm.scope === "selected") {
            // 导出选中的数据
            if (this.selectedRows.length === 0) {
              this.$message.warning("请先选择要导出的专家");
              return;
            }

            // 转换选中的数据
            exportData = this.selectedRows.map((row) => ({
              ...row,
              gender: row.gender === "male" ? "男" : "女",
              major: Array.isArray(row.major)
                ? row.major.join(" > ")
                : row.major,
              education: this.getEducationLabel(row.education),
            }));
          }

          // 生成文件内容
          let content = "";
          let fileName = `专家列表_${new Date().toISOString().slice(0, 10)}`;

          // 根据导出范围添加后缀
          if (this.exportForm.scope === "current") {
            fileName += "_当前页";
          } else if (this.exportForm.scope === "all") {
            fileName += "_全部";
          } else if (this.exportForm.scope === "selected") {
            fileName += "_选中";
          }

          // 构建CSV内容（Excel兼容格式）
          const headers = [
            "专家姓名",
            "审核状态",
            "审核处室",
            "性别",
            "年龄",
            "职位",
            "专业",
            "学历",
            "职称",
            "单位",
            "入库时间",
          ];

          // 添加UTF-8 BOM头，确保Excel正确识别中文编码
          content = "\ufeff" + headers.join(",") + "\n";

          exportData.forEach((item) => {
            const row = [
              item.expertName,
              item.auditStatus,
              item.auditOffice,
              item.gender,
              item.age,
              item.position,
              item.major,
              item.education,
              item.title,
              item.unit,
              item.entryTime,
            ];
            // 处理可能包含逗号或引号的值
            content +=
              row
                .map((value) => {
                  if (
                    typeof value === "string" &&
                    (value.includes(",") || value.includes('"'))
                  ) {
                    return `"${value.replace(/"/g, '""')}"`;
                  }
                  return value;
                })
                .join(",") + "\n";
          });

          // 设置文件扩展名
          fileName += this.exportForm.format === "excel" ? ".xlsx" : ".csv";

          // 创建并下载文件
          const blob = new Blob([content], { type: "text/csv;charset=utf-8;" });
          const url = URL.createObjectURL(blob);
          const link = document.createElement("a");
          link.href = url;
          link.setAttribute("download", fileName);
          document.body.appendChild(link);
          link.click();
          document.body.removeChild(link);

          // 显示成功消息
          this.$message({
            type: "success",
            message: `已成功导出${this.getExportScopeText()}数据`,
          });
        } else {
          // 准备导出参数
          const exportParams = {
            format: this.exportForm.format,
            scope: this.exportForm.scope,
            // 如果需要传递筛选条件，添加以下内容
            filters: {
              ...this.searchForm,
              page: this.currentPage,
              pageSize: this.pageSize,
            },
            // 如果是导出选中数据，传递选中的ID列表
            selectedIds:
              this.exportForm.scope === "selected"
                ? this.selectedRows.map((row) => row.id)
                : [],
          };

          // 发送真实API请求
          const response = await axios.post(
            `${this.apiConfig.baseUrl}/api/expert/export`,
            exportParams,
            {
              responseType: "blob", // 重要：指定响应类型为二进制流
              headers: {
                "Content-Type": "application/json",
              },
            }
          );

          // 创建下载链接
          const url = window.URL.createObjectURL(new Blob([response.data]));
          const link = document.createElement("a");
          link.href = url;

          // 设置文件名
          let fileName = `专家列表_${new Date().toISOString().slice(0, 10)}`;

          // 根据导出范围添加后缀
          if (this.exportForm.scope === "current") {
            fileName += "_当前页";
          } else if (this.exportForm.scope === "all") {
            fileName += "_全部";
          } else if (this.exportForm.scope === "selected") {
            fileName += "_选中";
          }

          // 添加文件扩展名
          fileName += this.exportForm.format === "excel" ? ".xlsx" : ".csv";

          link.setAttribute("download", fileName);

          // 触发下载
          document.body.appendChild(link);
          link.click();

          // 清理资源
          document.body.removeChild(link);
          window.URL.revokeObjectURL(url);

          this.$message({
            type: "success",
            message: `已成功导出${this.getExportScopeText()}数据`,
          });
        }
      } catch (error) {
        console.error("导出失败:", error);

        // 处理错误响应
        if (error.response) {
          const reader = new FileReader();
          reader.onload = () => {
            try {
              const errorData = JSON.parse(reader.result);
              this.$message({
                type: "error",
                message: errorData.message || "导出失败，请重试",
              });
            } catch (e) {
              this.$message({
                type: "error",
                message: "导出失败，请重试",
              });
            }
          };
          reader.readAsText(error.response.data);
        } else {
          this.$message({
            type: "error",
            message: "网络错误，请检查连接",
          });
        }
      } finally {
        this.loading = false;
        this.exportDialogVisible = false;
      }
    },

    // 获取导出范围的文本描述
    getExportScopeText() {
      switch (this.exportForm.scope) {
        case "current":
          return "当前页";
        case "all":
          return "全部";
        case "selected":
          return "选中";
        default:
          return "";
      }
    },

    audit() {
      this.selectedRows = this.$refs.expertTable.selection;

      if (this.selectedRows.length === 0) {
        this.$message.warning("请先选择要审核的专家");
        return;
      }

      // 初始化每个专家的新审核状态
      this.selectedRows.forEach((row) => {
        row.newAuditStatus = this.batchAuditStatus;
      });

      // 重置审核状态
      this.rejectReason = "";
      this.showRejectReason = this.batchAuditStatus === "审核不通过";

      // 显示对话框
      this.auditDialogVisible = true;
    },

    storage() {
      this.$message.info("入库功能");
    },

    viewDetail(row) {
      // 将专家数据存储到 localStorage，因为路由参数可能无法传递复杂对象
      localStorage.setItem("currentExpertData", JSON.stringify(row));
      // 跳转到表单页面
      this.$router.push({
        path: "/form",
        query: {
          id: row.id,
          mode: "view",
        },
      });
    },

    // 编辑专家信息
    editExpert(row) {
      // 复制数据，避免直接修改原始数据
      this.editForm = JSON.parse(JSON.stringify(row));
      this.editFormOriginal = JSON.parse(JSON.stringify(row));
      this.row = this.editFormOriginal;
      // this.editDialogVisible = true;
      this.basicvisibale = false;
      this.editvisibale = true;
    },

    // 保存编辑
    saveEdit() {
      this.$refs.editFormRef.validate((valid) => {
        if (valid) {
          this.loading = true;

          if (this.apiConfig.useMock) {
            // 模拟API调用延迟
            setTimeout(() => {
              try {
                // 模拟更新操作
                const index = this.expertList.findIndex(
                  (item) => item.id === this.editForm.id
                );
                if (index !== -1) {
                  this.expertList.splice(index, 1, this.editForm);
                }

                // 刷新数据
                this.fetchData();

                // 关闭对话框
                this.editDialogVisible = false;

                // 显示成功消息
                this.$message({
                  type: "success",
                  message: "专家信息更新成功",
                });
              } catch (error) {
                console.error("更新失败:", error);
                this.$message({
                  type: "error",
                  message: "更新失败，请重试",
                });
              } finally {
                this.loading = false;
              }
            }, 500);
          } else {
            // 真实API调用
            axios
              .put(
                `${this.apiConfig.baseUrl}/api/expert/${this.editForm.id}`,
                this.editForm
              )
              .then(() => {
                // 刷新数据
                this.fetchData();

                // 关闭对话框
                this.editDialogVisible = false;

                // 显示成功消息
                this.$message({
                  type: "success",
                  message: "专家信息更新成功",
                });
              })
              .catch((error) => {
                console.error("更新失败:", error);
                this.$message({
                  type: "error",
                  message: "更新失败，请重试",
                });
              })
              .finally(() => {
                this.loading = false;
              });
          }
        } else {
          this.$message({
            type: "warning",
            message: "请完成必填项",
          });
          return false;
        }
      });
    },
    changepage(val) {
      console.log(val);
      this.currentPage = val;
      this.fetchData(val);
    },
    // 新增专家信息
    saveAdd() {
      this.$refs.addFormRef.validate((valid) => {
        if (valid) {
          this.loading = true;

          if (this.apiConfig.useMock) {
            // 模拟API调用延迟
            setTimeout(() => {
              try {
                // 创建新专家对象
                const newExpert = {
                  id: Date.now(), // 使用时间戳作为临时ID
                  expertName: this.addForm.expertName,
                  auditStatus: this.addForm.auditStatus,
                  auditOffice: this.addForm.auditOffice,
                  gender: this.addForm.gender,
                  age: this.addForm.age,
                  position: this.addForm.position,
                  major: this.addForm.major,
                  education: this.addForm.education, // 使用下拉框的值
                  title: this.addForm.title,
                  unit: this.addForm.unit,
                  entryTime: new Date().toISOString().slice(0, 10), // 当前日期
                };

                // 添加到表格数据
                this.expertList.unshift(newExpert);

                // 刷新数据
                this.fetchData();

                // 关闭对话框
                this.addDialogVisible = false;

                // 显示成功消息
                this.$message({
                  type: "success",
                  message: "专家信息添加成功",
                });
              } catch (error) {
                console.error("添加失败:", error);
                this.$message({
                  type: "error",
                  message: "添加失败，请重试",
                });
              } finally {
                this.loading = false;
              }
            }, 500);
          } else {
            // 真实API调用
            axios
              .post(`${this.apiConfig.baseUrl}/api/expert`, this.addForm)
              .then(() => {
                // 刷新数据
                this.fetchData();

                // 关闭对话框
                this.addDialogVisible = false;

                // 显示成功消息
                this.$message({
                  type: "success",
                  message: "专家信息添加成功",
                });
              })
              .catch((error) => {
                console.error("添加失败:", error);
                this.$message({
                  type: "error",
                  message: "添加失败，请重试",
                });
              })
              .finally(() => {
                this.loading = false;
              });
          }
        } else {
          this.$message({
            type: "warning",
            message: "请完成必填项",
          });
          return false;
        }
      });
    },

    // 处理专业选择变化
    handleMajorChange(value) {
      console.log("选中的专业：", value);
    },

    // 格式化专业显示
    formatMajor(expert) {
      // const a = expert.split(',')
      // console.log(a);
      // // console.log(expert.split(','));
      // return a.length;
    },

    // 获取学历标签
    getEducationLabel(value) {
      const education = this.educationOptions.find(
        (item) => item.value === value
      );
      return education ? education.label : value;
    },
    handleSelectionChange(val) {
      console.log(val);
      this.selectedRows = val;
    },
    // 打开入库对话框
    storage() {
      this.selectedRows = this.$refs.expertTable.selection;

      if (this.selectedRows.length === 0) {
        this.$message.warning("请先选择要入库的专家");
        return;
      }

      // 检查是否都是规计处的专家
      // const nonPlanningExperts = this.selectedRows.filter(expert => expert.auditOffice !== '规计处');
      // if (nonPlanningExperts.length > 0) {
      //   this.$message.warning('只能对规计处的专家进行入库操作');
      //   return;
      // }

      // 重置入库状态
      this.isStoraging = false;
      this.storageProgress = 0;
      this.storageComplete = false;
      this.storageStatus = "准备入库";
      this.successCount = 0;
      this.failCount = 0;
      this.failList = [];

      // 显示对话框
      this.storageDialogVisible = true;
    },

    // 开始入库操作
    async startStorage() {
      this.isStoraging = true;
      this.storageStatus = "入库中";

      try {
        // 模拟入库过程
        const total = this.selectedRows.length;
        for (let i = 0; i < total; i++) {
          const expert = this.selectedRows[i];

          // 更新进度
          this.storageProgress = Math.floor(((i + 1) * 100) / total);

          // 模拟API调用
          await new Promise((resolve) => setTimeout(resolve, 800));

          // 模拟随机成功/失败
          const success = Math.random() > 0.2;
          if (success) {
            expert.storageStatus = {
              type: "success",
              text: "入库成功",
            };
            this.successCount++;
          } else {
            expert.storageStatus = {
              type: "danger",
              text: "入库失败",
            };
            this.failCount++;
            this.failList.push({
              expertName: expert.expertName,
              reason: "系统处理异常，请稍后重试",
            });
          }
        }

        // 完成入库
        this.storageComplete = true;
        this.storageStatus = "入库完成";

        // 显示结果消息
        if (this.failCount === 0) {
          this.$message.success(`已成功入库 ${this.successCount} 位专家`);
        } else {
          this.$message.warning(
            `入库完成，成功 ${this.successCount} 位，失败 ${this.failCount} 位`
          );
        }
      } catch (error) {
        console.error("入库失败:", error);
        this.storageStatus = "入库异常";
        this.$message.error("入库过程发生异常，请重试");
      }
    },

    // 关闭入库对话框
    closeStorageDialog() {
      this.storageDialogVisible = false;
      // 刷新列表数据
      this.fetchData();
    },

    // 处理单个专家审核状态变化
    handleAuditStatusChange(row) {
      // 检查是否有任何专家被设置为不通过
      this.showRejectReason = this.selectedRows.some(
        (row) => row.newAuditStatus === "审核不通过"
      );
    },

    // 确认审核
    async confirmAudit() {
      if (this.showRejectReason && !this.rejectReason.trim()) {
        this.$message.warning("请填写审核不通过的原因");
        return;
      }

      try {
        // 模拟API调用
        await new Promise((resolve) => setTimeout(resolve, 800));

        // 更新专家状态
        this.selectedRows.forEach((expert) => {
          expert.auditStatus = expert.newAuditStatus;
          if (expert.newAuditStatus === "审核不通过") {
            expert.rejectReason = this.rejectReason;
          }
        });

        // 关闭对话框
        this.auditDialogVisible = false;

        // 刷新数据
        this.fetchData();

        // 显示成功消息
        this.$message.success("审核操作已完成");
      } catch (error) {
        console.error("审核失败:", error);
        this.$message.error("审核失败，请重试");
      }
    },
    // 查看专家详细信息
    viewExpert(row) {
      // this.editDialogVisible = true
      // // 将专家数据存储到 localStorage
      // localStorage.setItem('expertData', JSON.stringify({
      //   ...row,
      //   // 添加评审会相关信息
      //   reviewInfo: {
      //     totalCount: row.reviewCount || 0,
      //     records: [
      //       {
      //         reviewName: '2023年度水利工程评审会',
      //         changeCount: 2,
      //         evaluation: '专业知识扎实，评审意见专业且中肯',
      //         rating: 4.5
      //       },
      //       {
      //         reviewName: '南水北调工程技术评审会',
      //         changeCount: 1,
      //         evaluation: '对项目细节把握准确，提供了很多建设性意见',
      //         rating: 5
      //       },
      //       {
      //         reviewName: '2024年度水利项目可行性研究评审会',
      //         changeCount: 3,
      //         evaluation: '能够深入分析项目风险点，提供了很好的解决方案',
      //         rating: 4.8
      //       }
      //     ]
      //   }
      // }));
      this.showvisibale = true;
      this.basicvisibale = false;
      this.row = row;
      // // 跳转到专家详情页面
      // this.$router.push('/form/index');
    },
  },
};
</script>

<style lang="less" scoped>
.dashboard-container {
  padding: 1.25rem;
  background-color: #fff;
  border-radius: 0.25rem;
  box-shadow: 0 0.125rem 0.75rem 0 rgba(0, 0, 0, 0.1);
  .mb-4 {
    margin-bottom: 1rem;
    margin-left: 2%;
  }
  .mx-2 {
    margin: 0 0.5rem;
  }
}
.primary-btn {
  width: 6.0625rem;
  height: 2.5rem;
  background-color: #205382;
  border-radius: 0.3125rem;
  color: #fff;
  font-size: 1rem;
}
.custom-success-btn {
  width: 6.0625rem;
  height: 2.5rem;
  background-color: rgba(29, 183, 82, 0.74);
  border-radius: 0.3125rem;
  color: #fff;
  font-size: 1rem;
  box-shadow: 0 0.1875rem 0.3125rem rgba(0, 0, 0, 0.35);
  &:hover,
  &:focus {
    background: #1db752;
    border-radius: 0.3125rem;
    color: #fff;
    box-shadow: 0 0.25rem 0.5rem rgba(0, 0, 0, 0.25);
  }
  &:active {
    box-shadow: 0 0.0625rem 0.1875rem rgba(0, 0, 0, 0.3);
  }
}
.custom-danger-btn {
  width: 6.0625rem;
  height: 2.5rem;
  background-color: rgba(225, 63, 31, 0.7);
  border-radius: 0.3125rem;
  color: #fff;
  font-size: 1rem;
  box-shadow: 0 0.1875rem 0.3125rem rgba(0, 0, 0, 0.35);
  &:hover,
  &:focus {
    background: #e13f1f;
    border-radius: 0.3125rem;
    color: #fff;
  }
}
.custom-primary-btn {
  width: 6.0625rem;
  height: 2.5rem;
  background-color: rgba(45, 107, 164, 0.7);
  border-radius: 0.3125rem;
  color: #fff;
  font-size: 1rem;
  box-shadow: 0 0.1875rem 0.3125rem rgba(0, 0, 0, 0.35);

  &:hover,
  &:focus {
    background: #2d6ba4;
    border-radius: 0.3125rem;
    color: #fff;
  }
}
.custom-info-btn {
  width: 6.0625rem;
  height: 2.5rem;
  background-color: rgba(31, 193, 189, 0.7);
  border-radius: 0.3125rem;
  color: #fff;
  font-size: 1rem;
  box-shadow: 0 0.1875rem 0.3125rem rgba(0, 0, 0, 0.35);

  &:hover,
  &:focus {
    background: #1fc1bd;
    border-radius: 0.3125rem;
    color: #fff;
  }
}

.custom-warning-btn {
  width: 6.0625rem;
  height: 2.5rem;
  background-color: rgba(26, 127, 221, 0.7);
  border-radius: 0.3125rem;
  color: #fff;
  font-size: 1rem;
  box-shadow: 0 0.1875rem 0.3125rem rgba(0, 0, 0, 0.35);

  &:hover,
  &:focus {
    background: #1a7fdd;
    border-radius: 0.3125rem;
    color: #fff;
  }
}

.button-container {
  display: flex;
  gap: 0.625rem;
}

.form-actions {
  display: flex;
  justify-content: flex-end;
  gap: 0.625rem;
}

.age-label {
  display: flex;
  align-items: center;
}

/* 新增样式类，控制表单行布局 */
.el-form-item {
  display: inline-flex;
  align-items: center;
  margin-right: 0.9375rem;
}

/* 调整输入框和选择框宽度，使其紧凑排列 */
.el-input,
.el-select {
  width: 12.5rem;
}

.custom-form-item {
  height: 2.6875rem;
  width: 19.375rem;

  .el-form-item__label {
    width: 3.75rem;
    height: 2.6875rem;
  }

  .el-input {
    width: 14.6875rem !important;
    height: 2.6875rem !important;

    .el-input__inner {
      height: 2.6875rem !important;
      line-height: 2.6875rem !important;
      // margin-left: 0.9375rem;
    }
  }
}

/* 全局调整（如果有其他表单项需要统一尺寸） */
.aligned-form {
  .el-form-item__label {
    height: 2rem;
    line-height: 2rem;

    &::before {
      vertical-align: middle; /* 红星与文字居中对齐 */
      margin-right: 0.25rem;
    }
  }

  .el-form-item__content {
    line-height: 2rem; /* 表单控件内容也保持一致的行高 */
  }

  // 对于单选按钮等特殊控件单独调整
  .el-radio-group {
    line-height: 2rem;
  }
}
.loading-mask {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 9999;
}
.empty-tip {
  padding: 1.25rem;
  text-align: center;
  color: #666;
  .el-icon {
    margin-bottom: 0.625rem;
    color: #999;
  }
}
/* 新增样式，确保红星对齐 */
.aligned-form {
  .el-form-item__label {
    // 确保所有标签有相同的高度
    height: 2rem;
    line-height: 2rem;
    // 确保红星与标签文本对齐
    &::before {
      vertical-align: middle;
      margin-right: 0.25rem;
    }
    .el-form-item {
      display: flex;
      align-items: center; /* 垂直居中 */
      margin-bottom: 1.125rem; /* 可根据需要调整间距 */
    }
  }
  // 确保表单元素垂直居中
  .el-form-item__content {
    line-height: 2rem;
  }
  // 特殊处理单选按钮的对齐
  .el-radio-group {
    line-height: 2rem;
  }
}
.text-warning {
  color: #e13f1f;
}
.mt-2 {
  margin-top: 0.5rem;
}
.mt-4 {
  margin-top: 1rem;
}
.storage-dialog {
  .storage-container {
    padding: 0 20px;
  }

  .storage-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;

    .selected-count {
      font-size: 16px;

      .count-number {
        color: #1890ff;
        font-weight: bold;
        margin: 0 5px;
      }
    }
  }

  .storage-content {
    .storage-progress {
      margin: 30px 0;
      text-align: center;

      .progress-text {
        margin-top: 10px;
        color: #666;
      }
    }

    .storage-result {
      margin-top: 20px;

      .result-summary {
        display: flex;
        gap: 40px;
        margin-bottom: 20px;

        .success-count {
          color: #67c23a;

          i {
            margin-right: 5px;
          }
        }

        .fail-count {
          color: #f56c6c;

          i {
            margin-right: 5px;
          }
        }
      }

      .fail-list {
        .fail-title {
          margin-bottom: 10px;
          color: #666;
          font-weight: bold;
        }
      }
    }
  }
}

/* 确保弹窗内的表格不会太高 */
.storage-dialog .el-table {
  margin-bottom: 20px;

  &::before {
    display: none;
  }
}

/* 调整进度条样式 */
.storage-progress {
  .el-progress-bar {
    margin-right: 0;
    margin-left: 0;
  }

  .el-progress__text {
    font-size: 16px;
  }
}

.audit-dialog {
  .audit-container {
    padding: 0 20px;
  }

  .audit-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;

    .selected-count {
      font-size: 16px;

      .count-number {
        color: #1890ff;
        font-weight: bold;
        margin: 0 5px;
      }
    }

    .audit-actions {
      .el-radio-button__inner {
        padding: 8px 20px;
      }
    }
  }

  .audit-content {
    .reject-reason {
      margin-top: 20px;

      .reason-header {
        margin-bottom: 10px;

        .reason-title {
          font-size: 14px;
          font-weight: 500;
          color: #1f2f3d;
        }

        .reason-required {
          color: #f56c6c;
          margin-left: 4px;
        }
      }

      .el-textarea {
        width: 100%;

        .el-textarea__inner {
          padding: 10px;
        }
      }
    }
  }
}

/* 调整表格内选择器的样式 */
.audit-dialog .el-table {
  .el-select {
    width: 100%;
  }
}
.el-col {
  border-radius: 4px;
}
.bg-purple-dark {
  background: #99a9bf;
}
.bg-purple {
  background: #d3dce6;
}
.bg-purple-light {
  background: #e5e9f2;
}
.grid-content {
  border-radius: 4px;
  min-height: 36px;
  display: flex;
  font-size: 0.8vw;
  font-weight: 700;
  justify-content: center;
  align-items: center;
}
.row-bg {
  padding: 10px 0;
  background-color: #f9fafc;
}

.input {
  width: 70%;
}
/* 响应式调整 */
@media (max-width: 768px) {
  .audit-dialog {
    .audit-header {
      flex-direction: column;
      gap: 15px;

      .audit-actions {
        width: 100%;

        .el-radio-group {
          width: 100%;
          display: flex;

          .el-radio-button {
            flex: 1;

            .el-radio-button__inner {
              width: 100%;
            }
          }
        }
      }
    }
  }
  ::v-deep .formsearch .el-form-item .el-form-item__content {
    margin-left: 0;
  }
}
</style>
